// 导入核心库
import ReactEChartsCore from 'echarts-for-react/lib/core';
// 导入echarts核心模块，该模块提供了使用echarts所需的接口
import * as echarts from 'echarts/core';
// 导入带有Chart后缀的图表
import { BarChart, LineChart, PieChart } from 'echarts/charts';
// 导入以Component为后缀的组件
import { GridComponent, TooltipComponent, TitleComponent, LegendComponent } from 'echarts/components';
// 导入渲染器，注意引入CanvasRenderer或SVGRenderer是必需的步骤
import { CanvasRenderer } from 'echarts/renderers';

import type { ChartCardType } from '../types/ChartCard.type';

// 注册所需的组件
echarts.use([BarChart, LineChart, PieChart, TitleComponent, TooltipComponent, GridComponent, CanvasRenderer, LegendComponent]);

const ChartCard = ({ option, className }: ChartCardType) => {
  return <ReactEChartsCore echarts={echarts} option={option} className={className} />;
};
export default ChartCard;
